import { BrowserRouter, Routes, Route } from "react-router-dom";

// 导入页面组件
import Home from "./views/Home/Home";
import Login from "./views/Login/Login";
import Index from "./views/Index/Index";
import NotFound from "./views/NotFound/NotFound";
import Register from "./views/Register/Register";
import UserInfo from "./views/UserInfo/UserInfo";
import StockInfo from "./views/Stock/StockInfo";
import StockList from "./views/Stock/StockList";
import StockTicker from "./views/Stock/StockTicker";
import Alpha from './views/Stock/StockAlphaChart';
import FundList from "./views/Fund/FundList";
import FundTrend from "./views/Fund/FundTrend";
import BondList from "./views/Bond/BondList";
import BondTrend from "./views/Bond/BondTrend";
import ForexSpot from "./views/Forex/ForexSpot";
import ForexTrend from "./views/Forex/ForexTrend";
import RequierAuth from "./components/RequireAuth/RequireAuth";
import StockAMinuteChart from "./views/Stock/StockAMinuteChart";
import About from "./views/About/About";
import News from "./views/News/News";
import StockKline from "./views/Stock/StockKline";
import StockPredict from "./views/StockPredict/StockPredict";
import RiskPreferencePage  from "./views/Preference/RiskPreferencePage";
import UserAsset from "./views/Asset/UserAsset";
import Transaction from "./views/Transaction/Transaction";
import PortfolioDecision from "./views/Portfolio/PortfolioDecision";
import PortfolioBacktest from "./views/Portfolio/PortfolioBacktest"
import RiskList from "./views/Risk/Risk";
import RiskStock from "./views/Risk/RiskStock";
import { useNavigate } from "react-router-dom";
import { setNavigate } from "./utils/http";


// NOTE 由于使用了useNavigate，所以必须单独定义一个页面（AppRoutes），你可以理解为固定写法
function AppRoutes() {
  // 为请求拦截器设置navigate
  const navigate = useNavigate();
  setNavigate(navigate);
  // 使用Routes定义多个不同的路由
  return (
    <Routes>
      {/* 使用Route定义某一个路由，如下是定义了当访问/login路径时，路由到Login页面 */}
      <Route path="/login" element={<Login />} />
      <Route path="/register" element={<Register />} />

      {/* 选择在App.js中统一设置路由，这样一来当其他页面想要使用该路由时，只要在相应位置使用<Outlet />代替即可 */}
      <Route
        path="/"
        element={
          <RequierAuth>
            <Index />
          </RequierAuth>
        }
      >
        <Route path="/home" element={<Home />} />
        <Route path="/news" element={<News />} />
         {/* <Route path="/strategy" element={<Strategy />} />*/}
        <Route path="/stock/:symbol" element={<StockInfo />} />
        <Route path="/stock" element={<StockInfo />} />
        <Route path="/stock/ticker" element={<StockTicker />} />
        <Route path="/stock/history/:symbol" element={<StockInfo />} />
        <Route path="/stock/history" element={<div>Stock History History</div>} />
        <Route path="/stock/list" element={<StockList />} />
        <Route path="/stock/a_minute" element={<StockAMinuteChart />} />
        <Route path="/stock/kline" element={<StockKline />} />
        <Route path="/stock/alpha" element={<Alpha />} />
        <Route path="/predict" element={<StockPredict />} />
        <Route path="/fund" element={<FundList />} />
        <Route path="/fund/list" element={<FundList />} />
        <Route path="/fund/trend" element={<FundTrend />} />
        <Route path="/bond" element={<BondList />} />
        <Route path="/bond/list" element={<BondList />} />
        <Route path="/bond/trend" element={<BondTrend />} />
        <Route path="/forex/spot_list" element={<ForexSpot />} />
        <Route path="/forex/trend" element={<ForexTrend />} />
        <Route path="/transaction/list" element={<Transaction />} />
        <Route path="/user-info" element={<UserInfo />} />
        <Route path="/about" element={<About />} />
        <Route path="/risk-preference" element={<RiskPreferencePage />} />
        <Route path="/asset" element={<UserAsset/>} />
        <Route path="/strategy/manage" element={<PortfolioDecision/>} />
        <Route path="/strategy/backtest" element={<PortfolioBacktest/>} />
        <Route path="/risk" element={<RiskList/>} />
        <Route path="/risk/scores" element={<RiskList/>} />
        <Route path="/risk/stock_scores" element={<RiskStock/>} />
      </Route>
tegy Backtest
      {/* 通常还需要统一设置一个404页面，在react-router-dom中，设置path="*"表示匹配所有未被定义的路由 */}
      <Route path="*" element={<NotFound />} />
    </Routes>
  );
}

// 主程序
function App() {
  return (
    <div>
      <BrowserRouter>
        <AppRoutes />
      </BrowserRouter>
    </div>
  );
}

export default App;
